<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <!-- 头部加载css（先加载插件，库等其他css 最后加载自己的 -->
  <link rel="stylesheet" href="./layui/css/layui.css">
  <link rel="stylesheet" href="./css/index.css">
</head>

<body>
  <div class="layui-main">
    <div class="layui-card">
      <div class="layui-card-header">
        学院成绩
        <button type="button" class="layui-btn">录入学员</button>
      </div>
      <div class="layui-card-body">
        <table class="layui-table">
          <colgroup>
            <col width="10%">
            <col width="15%">
            <col width="10%">
            <col width="20%">
            <col width="20%">
            <col>
          </colgroup>
          <thead>
            <tr>
              <th>学号</th>
              <th>姓名</th>
              <th>性别</th>
              <th>生日</th>
              <th>证件照</th>
              <th>操作</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>贤心</td>
              <td>2016-11-29</td>
              <td>男</td>
              <td>行</td>
              <td><img src="" alt=""></td>
              <td class="td">

                <button class="layui-btn layui-btn-radius layui-btn-normal">编辑</button>
                <button class="layui-btn layui-btn-radius layui-btn-danger">删除</button>
                <button class="layui-btn layui-btn-radius">档案下载</button>
              </td>
            </tr>

          </tbody>
        </table>
      </div>
    </div>
  </div>

  <!-- 添加到表单 -->
  <script type="text/html" style="display: none;" id="tpl-add">
        <form id = "add-form"style="margin: 20px;"lay-filter="abc" class="layui-form layui-form-pane" action="">
            <!-- 姓名 -->
            <div class="layui-form-item" >
              <label class="layui-form-label">姓名</label>
              <div class="layui-input-block">
                <input type="text" name="username" required  lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input">
              </div>
            </div>
         <!-- 性别 -->
            <div class="layui-form-item">
              <label class="layui-form-label">性别</label>
              <div class="layui-input-block">
                <input type="radio" name="sex" value="男" title="男" checked>
                <input type="radio" name="sex" value="女" title="女" >
              </div>
            </div>
            <!-- 生日 -->
            <div class="layui-form-item">
                <label class="layui-form-label">生日</label>
                <div class="layui-input-block">
                  <input type="date" name="year"id = "birthday" required  lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
                </div>
              </div>
              <!-- 证件照片 -->
              <div class="layui-form-item">
                <label class="layui-form-label"> 证件照片</label>
                <div class="layui-input-inline">
                    <input type="file" id="file" name="user_pic" style="display: none;">
                    <button type="button" class="layui-btn" id="test1">
                        <i class="layui-icon">&#xe67c;</i>上传图片
                    </button>
                </div>
                <!-- 预览图片 -->
                <div class="preview">
                    <img src="" alt="">
                </div>  
                <!-- //进度条 -->
                <div class='progress'>
                  <div class="layui-progress " lay-filter="demo" >
                    <div class="layui-progress-bar" lay-percent="10%"></div>
                  </div>
                </div>
              </div>
            <div class="layui-form-item">
              <div class="layui-input-block">
                <button class="layui-btn add-btn"style="display: none;" lay-submit lay-filter="formDemo">立即提交</button>
                <button class="layui-btn edit-btn"style="display: none;" lay-submit lay-filter="formDemo">修改</button>
                <button type="reset" class="layui-btn layui-btn-norma layui-btn-primary">重置</button>
              </div>
            </div>
          </form>
        
    </script>
  <!-- 先加载别人的在加载自己的 -->
  <script src="./layui/layui.all.js"></script>
  <script src="./js/jquery.js"></script>
  <script src="./js/index.js"></script>
</body>

</html>